<template>
  <div>
  <el-table :data="file_list">
    <el-table-column prop="name" label="名称"></el-table-column>

    <el-table-column prop="ext" label="后缀"></el-table-column>

    <el-table-column prop="size" label="大小"></el-table-column>

    <el-table-column label="操作">
      <template slot-scope="scope">
        <el-button type="primary" @click="downloadFile(scope.row)">下载</el-button>
        <el-button type="success" @click="changeImgUrl(scope.row)">预览</el-button>
      </template>
    </el-table-column>
  </el-table>
  <previewPicture ref="dialogs"></previewPicture>
  </div>
</template>

<script>
    import previewPicture from "./previewPicture";
    export default {
        name: "fileList",
        props: ['file_list'],
        components: {previewPicture},
        methods: {
            changeImgUrl(img){
              let ext = img.ext
              if(ext == 'doc' || ext == 'docx' || ext == 'ppt' || ext == 'pptx' || ext == 'xls' || ext == 'xlsx'){
                this.fun.previewOffice(img.fileUrl)
              }else {
                this.$refs.dialogs.visable = true
                this.$refs.dialogs.img_path = img.link
              }
            },
          //下载图片
          downloadFile(file){
            let url = file.fileUrl
            let fileName = file.fileName
            this.fun.downloadFile(url,fileName)
          },
        },
    }
</script>

<style scoped>

</style>
